<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!-- 标题 -->
    <title>购物车</title>
    <!-- 关键词 -->
    <meta name="keywords" content="" />
    <!-- 网站简介 -->
    <meta name="description" content="" />
    <!-- 自适应屏幕 -->
    <meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
    <!-- IE兼容 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 最新 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="css/bootstrap.css">
     <!-- 最新 删除提示 CSS 文件 -->
    <link rel="stylesheet" href="css/save-tip.css">
    <!-- 核心 CSS 文件 -->
    <link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body >
    <div class="tongdui-wrapper">
        <!-- 顶部 -->
        <div class="top-nav clearfix cart-nav">
            <div class="top-nav-left">
                <a href="" class="iconfont">&#xe64a;</a>
            </div>
            <div class="top-nav-center">
                购物车(5)   
            </div>
        </div>
        
        <div class="cart-goods-all">
            <!-- 每一个商店 -->
            <div class="cart-goods-list">
                <h4 class="clearfix">
                     <div class="left"><div class="shop-quanAll"></div><div class="shop-fanAll dn"></div></div>
                     <div class="right"><a href="">皇宫婚纱旗舰店<span class="iconfont">&#xe606;</span></a></div>
                </h4>
                <ul>
                    <li class="clearfix">
                        <div class="left">
                            <input type="checkbox" name="checkbox" id="checkbox-1"><label for="checkbox-1"></label>
                        </div>
                        <div class="right clearfix">
                            <div class="cart-gle">
                                <a href=""><img src="images/goods4.png" alt=""></a>
                            </div>
                            <div class="cart-gre">
                                <div class="cart-goods-name">
                                    <a href="">毛巾家纺纯棉吸水</a>
                                </div>
                                <div class="cart-goods-shuxin clearfix">
                                    <div class="cart-goods-sxl">
                                        颜色：白色
                                    </div>
                                    <div class="cart-goods-sxr">
                                        68.00点券
                                    </div>
                                </div>
                                <div class="cart-goods-edit">
                                    <div class="cgnumber ">
                                        <span class="reduc">–</span><input type="text" value="1"><span class="add">+</span>
                                    </div>
                                    <div class="cg-delete item">
                                        <input type="submit" class="cart-delete" value="">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </li>
                    <li class="clearfix">
                        <div class="left">
                            <input type="checkbox" name="checkbox" id="checkbox-2"><label for="checkbox-2"></label>
                        </div>
                        <div class="right clearfix">
                            <div class="cart-gle">
                                <a href=""><img src="images/goods2.png" alt=""></a>
                            </div>
                            <div class="cart-gre">
                                <div class="cart-goods-name">
                                    <a href="">毛巾家纺纯棉吸水</a>
                                </div>
                                <div class="cart-goods-shuxin clearfix">
                                    <div class="cart-goods-sxl">
                                        颜色：白色
                                    </div>
                                    <div class="cart-goods-sxr">
                                        68.00点券
                                    </div>
                                </div>
                                <div class="cart-goods-edit">
                                    <div class="cgnumber ">
                                        <span class="reduc">–</span><input type="text" value="1"><span class="add">+</span>
                                    </div>
                                    <div class="cg-delete item">
                                        <input type="submit" class="cart-delete" value="">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>

            <!-- 每一个商店 -->
            <div class="cart-goods-list">
                <h4 class="clearfix">
                     <div class="left"><div class="shop-quanAll"></div><div class="shop-fanAll dn"></div></div>
                     <div class="right"><a href="">皇宫婚纱旗舰店<span class="iconfont">&#xe606;</span></a></div>
                </h4>
                <ul>
                    <li class="clearfix">
                        <div class="left">
                            <input type="checkbox" name="checkbox" id="checkbox-3"><label for="checkbox-3"></label>
                        </div>
                        <div class="right clearfix">
                            <div class="cart-gle">
                                <a href=""><img src="images/goods5.png" alt=""></a>
                            </div>
                            <div class="cart-gre">
                                <div class="cart-goods-name">
                                    <a href="">毛巾家纺纯棉吸水</a>
                                </div>
                                <div class="cart-goods-shuxin clearfix">
                                    <div class="cart-goods-sxl">
                                        颜色：白色
                                    </div>
                                    <div class="cart-goods-sxr">
                                        68.00点券
                                    </div>
                                </div>
                                <div class="cart-goods-edit">
                                    <div class="cgnumber ">
                                        <span class="reduc">–</span><input type="text" value="1"><span class="add">+</span>
                                    </div>
                                    <div class="cg-delete item">
                                        <input type="submit" class="cart-delete" value="">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </li>
                    <li class="clearfix">
                        <div class="left">
                            <input type="checkbox" name="checkbox" id="checkbox-4"><label for="checkbox-4"></label>
                        </div>
                        <div class="right clearfix">
                            <div class="cart-gle">
                                <a href=""><img src="images/goods1.png" alt=""></a>
                            </div>
                            <div class="cart-gre">
                                <div class="cart-goods-name">
                                    <a href="">毛巾家纺纯棉吸水</a>
                                </div>
                                <div class="cart-goods-shuxin clearfix">
                                    <div class="cart-goods-sxl">
                                        颜色：白色
                                    </div>
                                    <div class="cart-goods-sxr">
                                        68.00点券
                                    </div>
                                </div>
                                <div class="cart-goods-edit">
                                    <div class="cgnumber ">
                                        <span class="reduc">–</span><input type="text" value="1"><span class="add">+</span>
                                    </div>
                                    <div class="cg-delete item">
                                        <input type="submit" class="cart-delete" value="">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>  
        
        <!-- 结算固定 -->
        <div class="cart-foot-nav clearfix">
            <div class="check-all clearfix">
                <div class="quanAll">全选</div>　
                <div class="fanAll dn">反选</div>　
            </div>
            <div class="price-total clearfix">
                <div class="price-total-lf left">
                    合计：
                </div>
                <div class="price-total-lr right">
                    <p>18.00购物券</p>
                    <p>3.80一券通</p>
                </div>
            </div>
            <div class="price-pay">
                <a href="pay.html">去结算</a>
            </div>
        </div>
        
        <!-- 底部导航 -->
        <div class="foot-nav clearfix">
            <a href="index.html" class="">
                <div class="iconfont">&#xe729;</div>
                首页
            </a>
            <a href="sort.html" class="">
                <div class="iconfont">&#xe604;</div>
                分类
            </a>
            <a href="shop.html" class="">
                <div class="iconfont">&#xe603;</div>
                附近
            </a>
            <a href="cart.html" class="active">
                <div class="iconfont">&#xe601;</div>
                购物车
            </a>
            <a href="usercenter.html" class="">
                <div class="iconfont">&#xe614;</div>
                我的    
            </a>
        </div>
    </div>

    <!-- jQuery文件 -->
    <script src="js/jquery.min.js"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="js/bootstrap.min.js"></script>
    <!-- 删除提示 js-->
    <script src="js/save.js"></script>
    <!-- 删除提示 js-->
    <script>
        $(document).ready(function(){
            $('.item .cart-delete').click(function(){
                var elem = $(this).closest('.item');
                $.confirm({
                    'message'   : '确认删除该款货物吗？',
                    'buttons'   : {
                        '确定'   : {
                            'class' : 'blue',
                            'action': function(){
                                
                            }
                        },
                        '取消'    : {
                            'action': function(){}  
                        }
                    }
                });
            });
        });
    </script>

    <!-- checkbox全部选中 -->
    <script>
        $(".quanAll").click(function(){
            $(".cart-goods-all").find("input").prop("checked",true);
            $(".quanAll").addClass("dn");
            $(".fanAll").removeClass("dn"); 
            $(".shop-quanAll").addClass("dn"); 
            $(".shop-fanAll").removeClass("dn");
        });
        //反选
        $(".fanAll").click(function(){
            $("[id^=checkbox-]").each(function(){
                $(this).click();
            });
            $(".quanAll").removeClass("dn"); 
            $(".fanAll").addClass("dn"); 
            $(".shop-quanAll").removeClass("dn"); 
            $(".shop-fanAll").addClass("dn");
        });
    </script>

    <!-- checkbox部分选中 -->
    <script>
        $(".shop-quanAll").click(function(){
            $(this).parent().parent("h4").siblings("ul").find("input").prop("checked",true);
            $(this).addClass("dn"); 
            $(this).siblings(".shop-fanAll").removeClass("dn");
        });

        //反选
        $(".shop-fanAll").click(function(){
            $(this).parent().parent("h4").siblings("ul").find("[id^=checkbox-]").each(function(){
                $(this).click();
            });

            $(this).addClass("dn"); 
            $(this).siblings(".shop-quanAll").removeClass("dn");
        });
    </script>

    <!-- 购物车加减 -->
    <script>
        $(function(){
            adddel();
        })
        function adddel(){
            $(".add").each(function() {
                $(this).click(function() {
                    var $multi = 0;
                    var vall = $(this).prev().val();
                    vall++;
                    $(this).prev().val(vall);
                })
            })
            $(".reduc").each(function() {
                $(this).click(function() {
                    var $multi1 = 0;
                    var vall1 = $(this).next().val();
                    vall1--;
                    if(vall1 <= 0) {
                        vall1 = 0;
                    }
                    $(this).next().val(vall1);
                })
            })
        }
    </script>

</body>
</html>
